<template>
  <el-dialog
    title="考试审核"
    :close-on-click-modal="false"
    :visible.sync="visible"
    lock-scroll
    class="JADP-dialog JADP-dialog_center"
    width="70%"
    append-to-body
    @close="close"
  >
    <el-row :gutter="16" class="cont1" v-loading="loading">
      <el-col :span="12">姓名：{{ dataForm.stuname }}</el-col>
      <el-col :span="12"
        >开始时间：{{
          dayjs(dataForm.teststarttime * 1).format("YYYY-MM-DD HH:mm:ss")
        }}</el-col
      >
      <el-col :span="24">
        <el-divider></el-divider>
        <h3>监控采集的考试画面</h3>
        <h4 v-if="!dataForm.xy_ks_stu_answer_processEntities">
          <el-empty description="暂无画面"></el-empty>
        </h4>
        <el-row :gutter="10">
          <el-col
            :span="6"
            v-for="item in dataForm.xy_ks_stu_answer_processEntities"
            :key="item.id"
            style="margin-top:10px"
          >
            <img :src="item.snapshots" alt class="tx_img" />
          </el-col>
        </el-row>
        <el-divider></el-divider>
      </el-col>
      <el-col :span="24">
        <h3>切屏记录</h3>
        <el-table
          :data="dataForm.xy_ks_screenRecordsEntities"
          border
          style="margin-top: 20px"
        >
          <el-table-column label="切出时间" prop="cutouttime"></el-table-column>
          <el-table-column
            label="切回时间"
            prop="cutovertime"
          ></el-table-column>
        </el-table>
        <el-divider></el-divider>
      </el-col>
      <el-col :span="24">
        <h3>操作日志</h3>
        <el-table
          :data="dataForm.xy_ks_exam_logEntities"
          border
          style="margin-top: 20px"
        >
          <el-table-column
            label="操作类型"
            prop="operationtype"
          ></el-table-column>
          <el-table-column
            label="操作内容"
            prop="operationcontent"
          ></el-table-column>
          <el-table-column
            label="操作时间"
            prop="operationtime"
          ></el-table-column>
        </el-table>
      </el-col>
    </el-row>
    <el-dialog
      title="审核意见"
      :close-on-click-modal="false"
      :visible.sync="opinionVisible"
      class="JADP-dialog JADP-dialog_center"
      lock-scroll
      width="40%"
      append-to-body
    >
      <el-form label-width="80px">
        <el-form-item label="审核意见">
          <el-input
            type="textarea"
            :rows="4"
            placeholder="请输入审核意见"
            v-model="auditopinion"
          >
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="opinionVisible = false">取 消</el-button>
        <el-button type="primary" @click="reviewFailed">确 定</el-button>
      </span>
    </el-dialog>
    <span slot="footer" class="dialog-footer">
      <el-button @click="opinionVisible = true">不 通 过</el-button>
      <el-button type="primary" @click="approved">通 过</el-button>
    </span>
  </el-dialog>
</template>
<script>
import request from "@/utils/request";
export default {
  name: "audit",
  data() {
    return {
      visible: false,
      opinionVisible: false,
      loading: true,
      dataForm: {
        xy_ks_stu_answer_processEntities: []
      },
      id: "",
      auditopinion: "" //审核意见
    };
  },

  methods: {
    close() {
      // this.$refs.ruleForm.resetFields();
      this.$emit("refresh", true);
    },
    init(item) {
      this.visible = true;
      this.loading = true;
      this.id = item.id;
      request({
        url: "/api/screen/Xy_ks_stu_answer_process/" + item.processid,
        method: "get"
      }).then(res => {
        this.loading = false;
        this.dataForm = res.data;
      });
    },
    approved() {
      request({
        url: "/api/scoreManage/Xy_ks_students_score/" + this.id,
        method: "put",
        data: {
          auditstatus: "通过",
          auditopinion: "",
          resleasstatus: true
        }
      }).then(res => {
        this.visible = false;
        this.$emit("refresh", true);
      });
    },
    reviewFailed() {
      request({
        url: "/api/scoreManage/Xy_ks_students_score/" + this.id,
        method: "put",
        data: {
          auditstatus: "不通过",
          auditopinion: this.auditopinion,
          resleasstatus: true
        }
      }).then(res => {
        this.visible = false;
        this.opinionVisible = false;
        this.$emit("refresh", true);
      });
    }
  }
};
</script>
<style scoped lang="scss">
// >>> .el-dialog {
//   margin-top: 10vh !important;
// }
// >>> .el-dialog__header {
//   border-bottom: 1px solid #ccc;
// }
>>> .el-dialog__body {
  padding: 10px !important;
}
.cont1 {
  line-height: 25px;
  font-size: 13px;
  padding-left: 20px;
  height: 600px;
  overflow-y: auto;
  .tx_img {
    width: 200px;
    height: 200px;
  }
}
</style>
